Si piensas añadir Lytebox te recomiendo leer antes esta entrada.

Hace tiempo hablé de un visor de imágenes que J.Miur de Vagabundia nos dió a conocer. Se trataba de un Script de Dynamicdrive cuya función es ampliar las imágenes sin necesidad de salir de la página.

Hoy he experimentado con Lytebox, tiene diferentes aplicaciones, por una parte podemos usarlo como visor con efecto de ampliación en imágenes únicas o agrupadas. Por otra dispone de un bonito Slideshow con imágenes que van cambiando cada 5 segundos sin necesidad de clicar en la siguiente.
Por último y para hacerlo más completo añade la posibilidad de añadir un iframe.

Para comenzar a usarlo es necesario descargar la última versión de Lytebox que en estos momentos en la 3.22

Una vez lo descargamos extraemos los archivos lytebox.js y lytebox.css y los alojamos en nuestro servidor.

Ya alojados los archivos nos situamos en nuestra plantilla Edición HTML y justo antes de </head> añadimos lo siguiente:

<script type="text/javascript" language="javascript" src="archivo-lytebox.js"></script>

<link rel="stylesheet" href="archivo-lytebox.css" type="text/css" media="screen" />

Donde archivo-lytebox.js los sustituiremos por la url del archivo lytebox.js que alojamos en nuestro servidor. Haremos lo mismo donde archivo-lytebox.css

Una vez guardados los cambios para ver los efectos tenemos tres opciones.

Añadirlo a una imagen única incluyendo la etiqueta rel="lytebox" al enlace.
<a href="Url-de-la-imagen" rel="lytebox" title="Título">texto o imagen</a>

¿Cómo añadimos una imagen en lugar de texto?
Sustituyendo texto o imagen por <img src="url-de-la-imagen">
Por lógica si lo que vamos a mostrar es una miniatura la imagen tendría que ser de menor tamaño que la original que veríamos en la ventana modal, para no vernos obligados a reducir la imagen para obtener la miniatura lo que podemos hacer es obligarla a mostrarse en un tamaño determinado.

<img style="width:150px;height:200px;"src="url- de -la imagen"/>

Con width le damos anchura y con height altura.

Hacerlo en un grupo de imágenes añadiendo la etiqueta rel="lytebox[gema]"
(Sustituir gema por el nombre adjudicado al grupo de imágenes) ejemplo: paisajes, flores...
<a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 1</a><a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 2</a><a href="Url-de-la-imagen" rel="lytebox[gema]" title="Título">texto o imagen 3</a>
Crear un Slideshow añadiendo la etiqueta rel="lyteshow[gema]"
(Sustituir gema por el nombre adjudicado al grupo de imágenes) en el siguiente ejemplo: Plumajes
<a href="Url-de-la-imagen" rel="lyteshow[Plumajes]" title="Título">texto o imagen 1</a><a href="Url-de-la-imagen" rel="lyteshow[Plumajes]" title="Título">texto o imagen 2</a><a href="Url-de-la-imagen" rel="lyteshow[Plumajes]" title="Título">texto o imagen 3</a>
La posibilidad de añadir un iframe con la etiqueta rel="lyteframe" o rel="lyteframe[gema]" resulta muy útil cuando tratamos de mostrar una página si necesidad de salir del blog.
<a href="iframe-único" rel="lyteframe" title="Título">texto o imagen</a>
Al usar lyteframe podemos añadir barra de scroll y escoger tamaño, lo haremos con la etiqueta rev
<a href="Url-de-la-pagina" rel="lyteframe" title="Título"rev="width: 400px; height: 300px; scrolling: no;">texto o imagen</a>
En "Título" añadimos el título de la imagen.
Donde "Url-de-la-imagen" y "Url-del-iframe" la Url correspondiente según el caso.
En "texto o imagen" escribiremos el texto que servirá de enlace. Si es una imagen sustituiremos "texto o imagen" por <img src="url-de-la-imagen">


"Añadir a nuestra ventana modal las imágenes"


La forma más sencilla de modificar un archivo es localizarlo en el Bloc de notas.
¿Dónde está ese Bloc de notas?
Debemos ir a nuestro escritorio y clicar en Inicio, buscamos el Bloc de notas y lo editamos de la siguiente forma:
Abrimos “Archivo” luego “Abrir…” y localizamos en nuestro PC el archivo que vamos a editar.
Una vez localizado lo modificamos según requiere, es decir añadiendo la url de cada imagen de forma que coincida nombre y color.
Una vez añadidas las imágenes guardamos los cambios en “Guardar como…” lo podemos guardar cambiando el nombre del archivo para saber que es nuestro archivo modificado o identificarlo en cualquier momento. Eso si… aunque cambiemos el nombre debemos guardarlo con la misma extensión.
Una vez guardado ya podemos subirlo a nuestro servidor.

"Pasos a seguir para añadir las imágenes al archivo CSS"


Si sólo utilizamos Lytebox como visor de imágenes bastará con añadir la imagen “CLOSE” (cerrar) y "Loading" (imagen de carga)

Buscaremos en el archivo descargado de imágenes una imagen del grupo Loading (imagen de carga) la buscaremos del color a nuestro agrado, la alojaremos en algún servidor para conseguir la url.

Una vez tenemos la url de la imagen localizamos en el archivo CSS donde dice:
#lbLoading {
position: absolute; top: 45%; left: 0%; height: 32px; width: 100%; text-align: center; line-height: 0; background: url(images/loading.gif) center no-repeat;

Añadiremos la url de la imagen en lugar de “images/loading.gif

Ahora vamos a añadir la imagen "Close"

#lbClose { width: 64px; height: 28px; float: right; margin-bottom: 1px; }
#lbClose.grey { background: url(images/close_grey.png) no-repeat; }
#lbClose.red { background: url(images/close_red.png) no-repeat; }
#lbClose.green { background: url(images/close_green.png) no-repeat; }
#lbClose.blue { background: url(images/close_blue.png) no-repeat; }
#lbClose.gold { background: url(images/close_gold.png) no-repeat; }


Para utilizar el Slideshow de Lytebox es necesario añadir todas las imágenes de un mismo color.

Si deseas ahorrar el trabajo de añadir las imágenes puedes copiar el contenido del siguiente archivo y añadirlo en la plantilla justo antes de </head> (contiene las imágenes en color gris)

Lytebox css con imágenes grey.


La demo de estos ejemplos la podéis ver en el siguiente blog de pruebas.

Marcos Horro Varela

Tiene muy buena pinta y bastante sencillo , pero la vagancia de subir las fotos xD

Un saludo,

Markos

Responder
La Blogueria

Me gusta mucho, me pongo a probarlo.
Abrazos Gema!

Responder
Liz Hopps

me muero pro probarlo con las fotos de mis bebes!!!...
Sniff...no me puedo suscribir a tu blog no se porque...me sale que expiró el tiempo de la conexion..sniff

Responder
Liz Hopps

Gemma ya te voy a empezar a atormentar...quiero cambiar la plantilla e mi blog de amigos por una maravillosa de blogger que se llama colibri...pero cuando lo intento me dice que está mal formada...otra preguntita...no se borran los post veradad?
y por ultimo...he visto que se le agregan monitos a la fecha de las entradas como en este blog http://miperroblog.blogspot.com/...en el hay patitas de perro...yo quisiera poner una brujita o algo...como se hace?

Sorry pro volver a molestar

Un besote =)

Responder
Liz Hopps

OHHH!!! maravilloso...como hiciste ese menu despegable con imagenes dinde dice "menciones"...yo lo quiero para una parte de mi blog!! enseñame!!
(ya estoy dando mas problemas)
Besis

Responder
Anónimo

Que esta NAVIDAD convierta...
Cada deseo en flor...
cada dolor en estrella...
Cada lagrima en sonrisa...
Cada corazón en dulce mirada...


Con todo mi cariño, te deseo que la magia de la Navidad te ilumine y te ayude a conseguir todos tus sueños.


FELIZ NAVIDAD....

Responder
Unknown

Hola Gema, ¿recibiste mi e-mail? contesté el primero y parece ser que no te llegó y el segundo no se si tampoco te ha llegado. Ya me dirás

Saludos!

Responder
Gem@

Markos... es muy sencillo, utiliza una entrada para subir las fotos, luego puedes eliminarla conservando las imágenes o dejarla en borrador ;)
Por un buen resultado vale la pena intentarlo ;)

La Blogueria todo tuyo.
Abrazos ;)

Elizabetha intentaré ver cual es el problema, llevo tiempo queriendo añadir otro suscriptor de e-mail.
Cuando se cambia de plantilla los post no se borran, si te da problemas no la agregues copiando y pegando hazlo descargando la plantilla en archivo xml a tu PC.
Luego la añades donde dice:Carga una plantilla desde un archivo de tu disco duro: EXAMINAR y SUBIR.
Hay una forma de añadir una imagen junto a la fecha puedes verla aquí.
Lo de las menciones es una variante del menú personalizado.
Pero también puedes crear bloques animados.
Ya tienes trabajo jajaja un abrazo voy a ver más comentarios que tengo tuyos por ahí :)

Mil gracias Luna, gracias por visitarme, por tu compañía y los buenos deseos.
Gracias amiga, que tengas unas Felices Fiestas y un mejor año nuevo.
Un abrazo ;)

Si, Dimas al leer tu comentario busqué en la carpeta de spam y ahí estaban tus correos. Ya te contesté sobre el tema, gracias por tomarte la molestia de avisarme y disculpa las molestias causadas.
Saludos cordiales ;)

Responder
Anónimo

Hola Preciosa Gem@!

Siempre doy ronditas por tu blog ya que tus tips siempre me son de gran utilidad.

Quise dejarte un comentario sobre el SlideFlickr, creo que no lo tienes publicado en tu blog, es una herramienta muy parecida al SlideShow pero de la propia casa Flickr.

Sorry si ya está comentado.
Cariños y felices fiestas para todos!
Karina

Responder
Asuknamun

Gracias Gema, siempre muy amable, tardas pero llegas xDD, mira he revisado el procedimiento, pero no entiendo la parte que dice "subirlo a tu servidor" como hago eso?
Recuerda que soy user blogger.

Mil besos ¡¡¡

Responder
Gem@

Hola Asuknamun Blogger no permite subir según que archivos así que yo suelo usar Googlepage es gratuito y una vez subido el archivo nos proporciona una url directa.
La podemos conseguir cuando el archivo ya está subido, poniendo el ratón sobre el archivo, botón derecho y buscamos propiedades. La dirección que nos ofrece es la que debemos copiar y pegar en el archivo que añadimos a nuestra plantilla.
Si sigues el enlace que te he dejado te llevará a un tutorial de J.Miur eso te simplificará el proceso de registrarte en GooglePage. ;)

Responder
Gem@

Hola Karina gracias por recordarmelo, hace tiempo hablé de Flickr y creo que es hora de dar otra vuelta para ver las mejoras que puede tener ;)
Un abrazo :)

Responder
Jose, a secas

Buenísimo script, Gem@.

Ya me he descargado los archivos y los he alojado en Google Pages junto con los .gif que vienen en el archivo .zip.

Saludos

Responder
Asuknamun

Hola nuevamente Gema, vuelvo por que hoy me había decidido aplicare este efecto en alguna imagen, pero no lo logre, osea el efecto lo he logrado pero solo a un texto, osea le doy click al texto y sale la imagen con el efecto, pero lo que quiero y creo que todos es para que salga en una imagen, en todo caso he probado con el primer código que haz puesto aquí.

A ver si me ayudas.

Saludos y un beso

Responder
Gem@

Hola Asuknamun si conseguiste el efecto en un texto lo tienes muy fácil de solucionar.
Lo que te falta es lo siguiente:
En lugar del texto debes òner lo siguiente:
<img src="url-de-la-imagen">
Donde url-de-la-imagen debes sustituirlo por la url de la imagen.
Es decir debes tener dos tamaños de imagen. La grande que visionamos y crea el efecto y la pequeña que mostraremos para clicar sobre ella, esta última es la que debes añadir en el código para imagen que va a sustituir el texto.
Ya me dirás si te resulta ;)

Responder
StudioM6

Tras un dia casi entero probando por fín me salió :D pero ahora tengo un pequeño problemilla... xD que cuando se abren las imágenes no se ven los iconos de Lytebox (el de "Next" "Exit" y demas) que se me puede haber pasado o por que ocurre esto.

Si quieres testearlo en mi blog es este y lo puedes comprobar con la primera entrada :)

http://studiom6.blogspot.com

Saludos & Gracias de nuevo Gema. ^^

Responder
Gem@

Tienes razón, en la página de Lytebox no explicaban como hacerlo y me olvidé mencionarlo.
Actualicé el post teniendo en cuenta tu sugerencia. ;)

Responder
StudioM6

Ole que ole! ahora si que si me va al pelo :D
Muchas gracias de nuevo Gema, te tengo fichada en afiliados y ya me pasare de vez en cuando a hechar una visita y a ver la novedades... :D

Salu2 muy fuerte.

Responder
Gem@

Ha quedado guapo en tu blog ;)

Responder
Ölrun

Tengo un problema con el lytebox: solo me funciona con imagenes alojadas en mi servidor. Si intento hacerlo con una imagen añadida con blogger, el lytebox se abre pero no carga la imagen (como si no la encontrara). He hecho muchas pruebas, con varios navegadores, y nada. ¿Le pasa a alguien más?

Responder
Gem@

Ölrun puede ser por la url que proporciona Blogger pero también por el tamaño de la imagen. blogger proporciona dos url la que vemos en las entradas y la que hace de enlace a la imagen en tamaño real ¿qué url añades?

Responder
la_miga

A mí me pasaba lo mismo que a Orlum: si la alojo en blogger no va, lo mismo que si utilizo imageshack, imagevenue o cualquier otra cosa. Pero si uso Google Pages o cualquier servidor (lycos, yahoo...) sí que va ;)

Responder
Gem@

Las mías están alojadas en Imageshack , pero últimamente el que más me convence es Hostfile

Responder
la_miga

Voy a probar ahora mismo! Gracias! ;) Yo normalmente uso imagevenue o imageshadow porque no "resiza" pero los links se rompen como tengan mucho tráfico.

Otra dudilla: ¿cómo puedo retocar el CSS para que se vean las imágenes del tamaño que son?

Responder
Gem@

La miga, Blogger nos proporciona tres tamaños:

Pequeñas:200
Medianas:320
Grandes:400

Esa es la medida en pixeles de ancho que Blogger nos da a escoger para visionar una imagen, aparte nos proporciona un enlace desde la misma imagen que visionamos a la imagen en tamaño real.

Desde la CSS no podemos modificar el tamaño de las imágenes que mostramos a no ser que lo hagamos manualmente desde el código HTML y que la imagen nunca sobrepase el tamaño de las entradas.

Una buena solución es añadir un visor de imágenes para verlas en el tamaño escogido (todas en el mismo)

Responder
Leito L.

hola me salio todo menos la parte de agregar LOADING, PLAY ,STOP porque no puedo modificar el archivo lytebox.css , cuando lo abro con el bloc de notas y modifico despues no puedo mantener la extension, no entiendo bien ese paso, me lo explicarias de nuevo. gracias

leo

Responder
Gem@

Leito L. situémonos en la descarga del zip. extraemos a nuestro PC los dos archivos lytebox.css y lytebox.js al mismo tiempo también podemos escoger las imágenes que nos proporciona el zip.
Luego abrimos el bloc de notas y buscamos el archivo lytebox.css ahí es donde haremos las modificaciones
En otra ventana aparte buscaremos un lugar donde alojar las imágenes que vamos a añadir.
Una vez tenemos la url de las imágenes las vamos añadiendo según se indica en el post.
La imagen de carga en Loanding.
En Close añadiremos el X para cerrar el visor y así sucesivamente hasta añadir las imágenes que vamos a utilizar.
Una vez modificado el archivo CSS clicamos en "guardar como..." y se guardará con la misma extensión, es decir como archivo CSS.
Ese archivo al igual que el archivo .js lo subiremos a un servidor para conseguir la url y añadirla en los scripts que alojaremos en nuestra plantilla.

Ya me dirás si te resulta bien, si no fuera así házmelo saber ;)

Responder
Leito L.

hola yo subi la imagen correspondiente (close, play etc,) con un color a eleccion a mi sevidor, modifique el archivo lytebox.css (solo en un color)y lo subi,como dice en el blog junto al lytebox.js y luego agregue en la plantilla el codigo y sus correspondientes direcciones, arme las fotos y nada no me aparece el "close", ahora bien volvi a modificar el lytebox.css y le puse la direccion de todos los colores tanto en "play" "stop" etc y me agarro el gris jaja algo es algo.
Muchas gracias por la paciencia.
leo

Responder
Gem@

Algo es algo, pero si no estás conforme y deseas "close" en otro color podemos seguir paso a paso las indicaciones hasta dar con el resultado que deseas ;)
¿La imagen de carga qué tal?

Responder
Pedro

Hola Gem@! Gracias por tus trucos... me han sido muy útiles. Me gustaría saber como puedo poner dentro de una ventana emergente de Lytebox un video de Youtube. Gracias! Salu2
JuanCarlos 3941

Responder
Gem@

JuanCarlos Lytebox no admite vídeos, creo que ningún visor de los que hasta ahora he mencionado los admite. Sin embargo hay una librería mucho más completa se trata de LightWindow puedes ver más información en el blog de J.Miur.
Suerte ;)

Responder
la_miga

Hola, de nuevo:

Buscando más truquillos para esto del lytebox me topé con algo muy similar para video llamado VideoBox que funciona lo mismo que éste, pero sólo para google video, youtube y un par más. Digo sólo porque yo tengo mis vídeos alojados en Dalealplay y no me funciona, e incluso retocando el JS he conseguido que se habra mi ventana pero no se llega a cargar el vídeo. He escrito al chico del script pero no he recibido respuesta. Aún así tal vez, gema, te interese hablar del sistemilla este porque va muy bien.

Sobre lo del CSS que te pregunté a mí me gusta mucho investigar y retocando el CSS he conseguido que se vean mis imágenes en su tamaño natural! Sólo hay que cambiar los códigos donde se ven los pixels el tanto por ciento y poner 100% :) Lo único que me puedo quejar del lytebox es que no sé porqué yo sólo veo el inconito de "Close", el "Prev" o "Next" lo veo en letra. Pero vale igual :D

Responder
Ana

Hola gema, muy buen script este, aun no lo he usado pero quiero hacerlo, pero tengo una duda antes de comenzar: no me quedo claro lo del titulo de "tecnoswa", se debe cambiar?? o como asi que le cambio el nombre al grupo de imagenes, si cada imagen tiene una url diferente?? en donde influye que yo le ponga cualquier nombre alli??
Gracias por tu ayuda, saludos.

Responder
Gem@

Ana tecnoswa es nombre del blog, la fuente donde conseguí el script, no altera nada si no lo cambias o si añades otra diferente y esta se repite.
Sustituir tecnoswa por el nombre adjudicado al grupo de imágenes es para diferenciar los grupos que puedas tener.

En pocas palabras para una mejor organización del set de imágenes.

Responder
Ana

Ah ok gema muchas gracias por tu ayuda y por tus excelentes aportes y explicaciones.

Entonces lo podre dejar asi y cuando vaya a cargar otras imagenes les doy otro nombre y ya, eso es todo? Eso es como para diferenciarlas para nosotros mismos, no para que haga algo el scritp, es asi verdad?

Responder
Gem@

Veamos Ana cuando dije diferenciar no me refiero a diferenciarlo nosotros sino a diferenciarlo el script.
Veamos.. si añades un grupo de cuatro imágenes el script te va mostrando las imágenes y al mismo tiempo en cada imagen (en la parte inferior) va indicado en qué orden está la imagen y cuantas imágenes componen el grupo.
Por ejemplo: visionamos la imagen número dos, indicará "image 2 of 4" si visionamos la 4 indicará "image 4 of 4"

Si añadimos a nuestro blog un segundo grupo de imágenes con el mismo nombre (en este caso tecnoswa) y clicamos en una imagen nos mostrará el número de orden de ese grupo pero también nos mostrará el número total de todas las imágenes que contengan el mismo nombre de grupo (tecnoswa)

La importancia de Sustituir tecnoswa sirve para diferenciar los grupos y que nos muestre con exactitud el número de imágenes en cada grupo.
No sustituirlo no altera el script pero tampoco da una información exacta del número de imágenes ;)

Responder
Gem@

La_miga el texto de Close, Prev o Next lo puedes solucionar si agregas la imagen. Mira en esta misma entrada donde dice:
"Pasos a seguir para añadir las imágenes al archivo CSS"
Gracias por la información de VideoBox le daré una miradita cuando tenga tiempo ;)

Responder
Ana

Ok gema, de nuevo gracias, voy a probar a ver si me sale jejjeje, muchas gracias, saludos

Responder
Anónimo

antes que nada gracias por el aporte, pero sabes tengo un rpoblema, no me aparece el dialogo close en la ventana emergente



saludos

Atte Majalca

Responder
Gem@

Majalca debes añadir la imagen, el archivo contiene las imágenes en 5 colores distintos. Lee el post a partir de "ACTUALIZADO" te será de ayuda ;)

Responder
Unknown

Hola Gem@, muy buen blog, no lo conocía y googleando llegué a él. A partir de ahora entraré más a menudo. Gem@ quiero hacerte una pregunta, ¿Tienes las imagenes de Lytebox en español? Al menos el Close, Prev, Next y de ser posible la animación de Loading, ahhh y en cada uno de los colores posibles en Lytebox. Pues te agradecería que al menos si no los tienes ya en español que me ofrecieras algún link conocido donde pueda conseguirlos, muchas gracias, Carlos.

Responder
Gem@

Carlos Javier siento ver tan tarde tu comentario :( de todas formas no sabría ahora mismo donde localizar esas imágenes
¿Quizás buscando iconos para web en Google?


Gracias por la corrección JESY2474, yo también los he cargado todos, espero que te resulte bien :)

Responder
Anónimo

Hola Gema, he utilizado mucha tus entradas pero poco te he molestado, porque siempre me ha salido sin contratiempo. pero me gusta mucho ese efecto que hace la foto pero no me sale, la foto habré en otra pagina normalmente. sin embargo he notado que cuando oprimo en la foto que tienes como ejemplo en tu blog , sale muchas veces el archivo de descarga, lo cual es confuso. otra cosa en la parte donde dice miniatura cual es el enlace que hay que colocar para que no salga texto solo imágenes.
por cierto esta en un blog de prueba que todavía no esta abierto al publico
espero me allá explicado. gracias gema

Responder
Gem@

Hola Solidaridad el efecto que dices del ejemplo no consigo encontrar el problema porque al comprobarlo carga bien la imagen :(
(quizás podría ser cosa de actualizar la página ya me dirás si continúa)
Sobre la forma de añadir una miniatura se trata de añadir el código de imagen sustituyendo el texto:
<img src="url-de-la-imagen">
Cualquier cosa ya me dices ;)

Responder
Anónimo

Hola GEMA, al fin coloque el Slideshow añadiendo la etiqueta rel="lyteshow[tecnoswa]" en el blog de pruevas, pero no cuadro como colocar el play stop.

te agrdeceria que miraras en tu correo como tengo el codigo, y me ayudes indicandome donde tengo que colocar ese bendito objeto.

a por cierto lo de la imagen de tu blog en este post, no presenta fallas es problemas de la velocidad de mi servidor y reiniciar tu pagina.

Responder
Gem@

Hola Solidaridad pensaba contestar tu mail pero al ver el comentario me detuve aquí.
Verás las imágenes de PLAY y PAUSA hay que añadirlas al archivo css al final de la entrada hay una actualización donde indico donde añadir cada imagen.
Cualquier cosa si no lo ves claro me dices algo ;)

Responder
Anónimo

Gracias Gema, como todo cuando no se saben las cosas resulta un poco confuso , pero después resulta todo tan sencillo.

mi pregunta ahora Gema, es que quiero colocar 3 imágenes miniaturas que queden en forma horizontal, juntas una tras otra.

y que cada una de ellas me lleve a un Slideshow en donde se puedan apreciar 5 fotos, odvio cada Slideshow tiene que ser independiente del otro.

yo ya lo he hecho pero colocando el código en elementos HTML diferentes lo cual no me permite juntar las imágenes....hay dios espero que me allas entendido.
de todo modos gracias

Responder
Chadmin

buenisimo muchas gracias :D por la info

Responder
Gem@

Te entendí perfectamente solidaridad y creo que tengo un correo tuyo con el código voy a verlo y te contesto ;)

Gracias a ti Chadmin por comentar ;)

Responder
Unknown

Gracias GEMA , por entenderme. ayer fue un día de limpieza del pc, y también del "elemento que ocasiono este impace". aun así me puse a trabajar las imágenes ahora si verificando que correspondan con las que son, y te cuento que todavía no logro mi objetivo, pero no importa gracias a ti estoy aprendiendo a manejar el código y descubriendo que puedo alojar las imágenes en el mismo blogger.

hoy con mas calma te envió el código verdadero.

gracias GEMA, y nuevamente agradezco tu comprensión y olvidar todo lo que paso.

Responder
Gem@

Ya recibí el código y te he contestado Solidaridad espero que termines a tiempo ese trabajo.
Por lo demás todo aclarado ;)

Responder
Anónimo

Hola!, estoy usando este codigo y el unico impedimento que le encuentro que no funciona la opcion "guardar imagen como" cuando cliqueo con el boton secundario del mouse sobre la imagen ampliada! hay forma de cambir esto?, saludos

Responder
Admin

a que servidor subes los archivos? el css y el otro

Responder
Gem@

No Diego la imagen que aparece en la ventana modal no puedes guardarla pero si copiar la url.


Hola P4BLQ yo suelo alojar estos archivos en Sky Drive y boxstr pero mayormente en Sky Drive.

Responder
Admin

Gracias ya logre colocar este efecto en mi blog luego de unos problemas que solucione facilmente,ahora no logro colocar las imagenes en forma horizontal

Responder
Gem@

P4BLQ en el archivo css viene la medida en la que se muestra la imagen es de 200x200 he modificado ese archivo y aumenté a 450x450.
Ouedes ver el ejemplo en la primera imagen de esta entrada que la he modificado añadiendo una imagen horizontal.
Si no quieres modificar el archivo prueba con este

Responder
Admin

Creo no me explique bien o yo estoy haciendo algo mal,al postear las imagenes blogger me las coloca una encima de la otra (vertical) y yo quiero que queden en horizontal haci como lo tienes tu aqui en el blog.
Ese es uno de los problemas,tambien me sucede que la primera ves que hago click sobre una imagen me redirecciona a la direccion de esa imagen y luego cuando regreso al blog y clickeo nuevamente en la misma imagen ahi si hace el efecto del lytebox y otra cosa que note,es que el efecto es bastante lento a comparacion de como lo hace aqui,eso no se si hay que modificar algo en el css

Responder
Gem@

Veamos...
Cuando subes las imágenes a Blogger te las sitúa una sobre la otra, lo que hacemos es clicar la pestaña de html y unir los códigos de las imágenes de manera que entre uno y otro sólo quede un espacio.
debes tener en cuenta que a mayor tamaño de imagen menor número de imágenes podrás añadir en una misma fila.

Sobre el otro problema es normal lo que ocurre porque la ventana modal se muestra una vez cargada la página completamente, pero no esta ventana modal ocurre con cualquier archivo.

Responder
Admin

Ya no se que mas hacer, he probado todo y sigo teniendo los mismos problemas, aunque deje la pagina cargando una hora cuando hago click sobre la foto siempre me reenvia a la url de la imagen.Lo que si noto y eso es una de las cosas que mas me frusta es que cuando logro hacer que realise el efecto lo hace todo muy lento y no comprendo,si supuestamente el codigo y esas cosas es lo mismo que tu colocastes aqui en este blog, por que razon es mucho mas rapido aqui que en el mio, y lo peor es que va a ser la seccion mas visitada de mi blog y en 5 dias hay una fiesta,en donde vivo y ese dia es el que tenia pensado darla a conocer espero me puedas ayudar

Responder
Gem@

¿De qué blog estamos hablando P4BLQ ?

Responder
Gem@

Ya lo he visto es el script el que no está bien, voy a hacer una prueba y te digo algo...

Responder
Gem@

He mirado y lo que ocurre es problema del script,el servicio de Boxstr funciona correctamente lo que me hace pensar que quizás no copiaste bien la url o se ha eliminado ese archivo.

Responder
Admin

Las url estan bien y cual seria el problema del script para solucionarlo?

Responder
Gem@

Si pegas la url en la barra de direcciones verás que da error (debería mostrarse para su descarga) el script está bien lo que falla es la url del archivo js.

Responder
Anónimo

Hola!

Muchas gracias por el script, me ha funcionado super bien. Pero tengo una duda...
Lo que pasa es que tengo mi blog con redireccionameinto con un dominio.tk. Cuando entro poniendo la url de blogspot, el efecto funciona sin problemas, pero cuando entro por mi dominio.tk, el script no funciona.
Sabrás por que?¿..

Blog --> medinfoweb.blogspot.com
Direccion --> www.medinfochile.tk

Saludos!!

Responder
Anónimo

Hola!

Muchas gracias por el script, me ha funcionado super bien. Pero tengo una duda...
Lo que pasa es que tengo mi blog con redireccionameinto con un dominio.tk. Cuando entro poniendo la url de blogspot, el efecto funciona sin problemas, pero cuando entro por mi dominio.tk, el script no funciona.
Sabrás por que?¿..

Blog --> medinfoweb.blogspot.com
Direccion --> www.medinfochile.tk

Saludos!!

Responder
Gem@

Hola Francisco siento no poder ayudarte, el tema sobre dominos es algo que no he tratado y no sé decirte como solucionarlo :(

Responder
Anónimo

Hola otra vez yo.. otra consulta.... cuando uso la etiqueta rev no me sale con el tamaño especificado... es mas me sale en el post con esto rev="width: 800px; height: 600px; scrolling: no;">Google Search

Responder
Gem@

Yaev ¿Puedes pasarme el código completo que añades o decirme un sitio en concreto dónde lo tienes añadido?

Responder
los sin techos

Hola querida GEMA, gracias por tus enseñanzas, he puesto en practica ese script y te cuento que me encanta ..pero quiero que las imagenes se vean mucho mas grande cuando se produce el efecto,me puedes indicar. gracias

Responder
Gem@

yz los sin techos la imagen grande se muestra en su tamaño real, es decir el que tu añades :)

Responder
Admin

Aqui nuevamente de regreso, ultimamente he estado viendo algunos blogs en los cuales aplican este efecto y funciona a la perfeccion incluso el blog de los sintechos funciona de la misma manera, y no entiendo por que si yo aplico este mismo efecto no funciona tan bien.
Para que funcione luego de que cargo todo el blog debo actualisar y ahi recien funciona,tienes des cual sea el problema?

Responder
Gem@

yz He visto el mensaje del blog P4BLQ no te preocupes y no busques alojamiento porque voy a actualizar esta entrada explicando como añadir los archivos a la plantilla. Lo tenía pendiente pero es que no me ha dado tiempo, en lo que queda de semana estará listo :)

Responder
Admin

ok estare al pendiente detodos modos buscare algun alojamiento ya que el de windows no convence y boxstr mas o menos

Responder
Gem@

yz Si descubres alguno interesante soy toda oídos :D

Responder
Priamo

Hola Gema: En general las imagenes no se abren lo suficientemente rapidas sino con lentitud.¿Puede ser debido a esta confi: en CSS he colocado 500 ancho x450 de alto. y la foto original tiene 600x450???
Que puede estar pasando? Podias hecharle un vistazo a la entrada con las fotos"Coches Ninco 1:32"
mi blog de pruebas: priamo24.blogspot.com

Un saludo

Responder
Gem@

yz Priamo carga muy rápido!! debe ser tu conexión que va lenta :(

Responder
Priamo

Hola Gema: El problema parece que estaba en el Explorer. No he podido saber el porque en un ordenador con IE abre bien y en el mio con IE no lo abre bien. La solucion ha sido cambiar a Firefox y ya abre bien pero: el blog se me a desplazado hacia la izquierda él solito: como lo soluciono.??

mi blog:eltallerdepriamo.blogspot.com
Muchas gracias

Responder
Priamo

Hola de nuevo;Sigo en IE,por tanto no te entretengas.
Sí quisiera saber lo siguiente, Como puedo colocar una simbolo debajo de cada foto que indique que haciendo clik se agranda la foto. En esta direccion:http://evotecshop.com/product_info.php?products_id=2987&osCsid=0a4871baaf4478bab8e7da59521c83fe
hay uno colocado, podrias decirme donde conseguir otros y repito como insertarlo en la cada foto??

Muy agradecido.

Responder
Gem@

yz Hola Priamo, eso quisera yo tener tiempo para entretenerme, y ordenar mi blog que buena falta le hace :)
El problema de visualizar diferente con Explorer o Firefox es un problema de siempre, si queremos ver o intentar ver igual con diferentes navegadores lo que hay que hacer es cada vez que hacemos un cambio comprobar ese cambio con otro navegador para ahorrarnos estos disgustos.
Mirando tu plantilla observo algunas cosas que yo cambiaría.
En footer tienes width:660px; cuando lo ideal sería tener lo mismo que en outer-wrapper es decir width:900px;
Luego veo que le diste a main-wrapper 690px, a sidebar-wrapper 200px en total suma 890px y el ancho total del blog tiene 900px lo que haría sería probar a darle más anchura a outer-wrapper no digo que esto te solucione el problema pero puedes comprobar e ir mirando en vista previa.
-Sobre la imagen que dice ampliar se añade a continuación de la miniatura de forma que quede dentro de enlace.
¿Dónde conseguir otros? puedes mirar en páginas de iconos o cualquier imagen que te guste en una página si ves que no está protegida puedes llevártela :D

Responder
Priamo

Hola Gema y gracias por tu interes.
Me hago un lio, podrias decirme donde exactamente del enlance y como colocar (img src....) el boton en la parte de abajo de la foto, es que me está volviendo loco y lo malo es que debe ser sencillo pero...
Otra cosa se puede modificar y donde los parametros de abertura de la foto.Gracias
mi blog de pruebas: priamo24.blogspot.com

Responder
Gem@

yz Hola Priamo, te explico con un ejemplo con la imagen incluida, lo copias y pegas en tu blog de pruebas y te resultará más sencillo.

Para añadir una imagen añadimos:
<a href="http://4.bp.blogspot.com/_q4j3j-JA2ro/SUhf9AOpBZI/AAAAAAAAILY/RfbGoAbAYPU/s400/00678_vancouverdusk_480x272.jpg" rel="lytebox" title="Título"><img style="width: 175px; height: 125px;" src="http://4.bp.blogspot.com/_q4j3j-JA2ro/SUhf9AOpBZI/AAAAAAAAILY/RfbGoAbAYPU/s400/00678_vancouverdusk_480x272.jpg">
Al final de ese código falta el cierre del enlace que sería </a> pero no lo añadimos porque queremos añadir otra imagen que nos sirva de enlace para abrir la ventana modal así que lo que hacemos es a continuación de ese código añadir la nueva imagen:
<img style=" float:center;margin-left:145px;margin-top:-10px;"title="Haga Click para agrandar" alt="Haga Click para agrandar" src="http://www.infonur.com/images/lupa.gif"/>
</a>
Ahí si añadimos el cierre (marcado en negrita, ahora bien, como la nueva imagen es pequeña se sitúa a la izquierda y no al centro de la imagen en miniatura, así que le añadimos unos estilos para darle posición (los marqué en negrita también)

Si la miniatura la añades al centro en lugar de la izquierda también puedes añadir posición a la miniatura con
<a style="margin-left: 85px;" href="http://4.bp.blogspot.com/_q4j3j-JA2ro/SUhf9AOpBZI/AAAAAAAAILY/RfbGoAbAYPU/s400/00678_vancouverdusk_480x272.jpg" rel="lytebox" title="Título">
¿Se entiende? :O

Responder
Gem@

yz (la imagen de la lupa la tomé prestada para el ejemplo, por favor si la utilizas no uses esa url )

Responder
Priamo

Gracias por tu rapida contestacion pero sigo sin poder colocar la lupa debajo de la foto y centrada. En el blog de pruebas verás una entrada con tu nombre y una foto de prueba según tus indicaciones (verás que la lupa sale a la Decha de la foto y cuando coloco otra foto me sale debajo de la primera. Bueno en resumen si ves la otra entrada que`pone "scalextric" allí hay una secuencia de imagenes= así es como lo quiero PERO con la lupa centrada debajo de cada una de las fotos.
Que paciencia tienes....Mil gracias

Responder
Gem@

yz Si se trata de un grupo de imágenes creo que lo mejor es incluirlas en un div para que cada imagen de la ventana modal quede incluida en el mismo div de la lupa.
Es un poco laborioso pero una vez se consigue ya sirve el mismo código para posteriores ocasiones.
Ahora no me da tiempo mañana probaré y te paso el resultado ;)

Responder
Priamo
Este comentario ha sido eliminado por el autor.
Responder
Priamo

Gema gracias espero ansioso esa estructura div pero debo te debo una aclaracion porque soy yo quien no se explica bien:perdona.
Que persigo que no lo he explicado: Al clikar en la sidebar en Mis Coches__Ninco 1.32 por ejemplo quiero que me vaya a la relacion de fotos de coches que poseo y que iré ampliando a medida que tenga más coches.
Yo pensé en abrir una entrada para cada tipo de boton de la sidebar pero y te pregunto:¿ puede abrirse de otra forma ya que si abro una entrada me sale la fecha y al final lo de comentario....? y no me gusta que eso salga

Responder
Gem@

yz Aún estoy con ese tema Priamo, me resulta dificil al tratarse de un grupo de imágenes y que las segunda imagen quede centrada justo debajo de la primera consiguiendo la misa función de enlace, al incluirlas en un div produce un salto de línea con demasiado espacio. Voy a intentarlo con tablas y si veo que no resulta bien lo consultaré :O

Responder
Priamo

Espero, sé que estás en ello.Gracias

Responder
Gem@

yz Siento la espera Priamo pero ha valido la pena ¿Puedes mandarme un mail?

Responder
Priamo

Hola Gema: Mi e-mail: priamo@slotdigital.com

Gracias por tu interes, ya te contaré

Responder
Gem@

yz Enviado Priamo :)

Responder
Priamo

Salen las fotos pero y el icono de la lupa:donde iría??

Saludos y gracias

Responder
Gem@

yz Priamo hay dos opciones de mostrar la lupa una es la que te he mandado, si sigues los pasos del mail se ve la lupa (voy a verlo en tu blog de pruebas)
La segunda opción es para explicarlo más detallado lo tengo en borrador ahora mismo y le daré salida cuando esté terminado :D

Responder
Gem@

yz Ya puedes ver esa entrada Priamo :D

Responder
Priamo

Yo no veo la lupa,lo siento.
De que entrada hablas??

un saludo

Responder
Gem@

yz Aquí Priamo:
http://gemablog-.blogspot.com/2009/06/anadiendo-una-lupa.html

Creo que es porque usas Explorer como navegador y por eso no la visualizas :(

Responder
Priamo

Bueno ya creo que tengo toda la informacion, me pongo a trabajar en ello y ya te contaré como queda en mi blog.
Gracias po todo

Responder
Gem@

yz OK Priamo, veré otro comentario tuyo que hay por ahí :)

Responder
Priamo

Gema una pregunta a raiz de una prueba: Cuando hablas de hacerlo con un grupo de imagenes me viene una duda:te refieres a lo que yo persigo:Una foto en miniatura en la entrada que al clickar en la lupa abra esa foto y a partir de ahí a ver el resto de fotos (pe. 1 de 3).
Si es esto por favor puedes ponerme un ejemplo, te lo agradeceria.
Una saludo de nuevo

Responder
Gem@

yz Priamo cuando hablo de un grupo de imágenes me refiero a varias imágenes que se abren de amplían de forma independiente, es decir una imagen al lado de otra y necesariamente hay que hacer click sobre cada imagen para ampliarla.
Lo otro, eso que comentas que a partir de la primera foto se ven las siguientes es un Slideshow.
Los ejemplos los tienes en esta misma entrada :O

Responder
Priamo

hOla Gema. Yo solo quiero saber si se puede con una SOLA miniatura en la entrada al clickar sobre ella,se abra esa foto e indique en la parte de abajo ,por ejemplo,1 de 3 o de4..., y desde ahí verlas todas, pero repito con UNA SOLA FOTO EN "Entradas". Por cierto el ejemplo de lytebox de tres fotos: la primera se abrenormal, la segunda indica 1de2 y la tercera 1de2.Igual para Slideshow:es normal eso.Gracias por tu paciencia

Responder
Gem@

yz Si se puede Priamo, es suficiente si añades únicamente una miniatura, en el ejemplo nos da cuatro opciones de añadir miniaturas.
texto o imagen 1
texto o imagen 2
texto o imagen 3
texto o imagen 4
Añadimos el código tal y como está con los enlaces a la imagen que mostramos en la ventana modal pero.. únicamente añadimos la primera miniatura donde dice texto o imagen 1 el resto de miniaturas podemos omitirlas al añadir el enlace para la imagen ampliada se mostrarán pero no la imagen pequeña.

Responder
Priamo

Gema:LO HE CONSEGUIDO tanto para Lytebox como para Lyteshow. Si quieres vista mi blog de pruebas para ver el resultado que de seguro sin tu ayuda no lo hubiese logrado.
Un comentario que ya he leido en este y otros blogs: Con Firefox todo va mejor que con IE,verdad? lo digo porque me funciona con mayor soltura con Firefox que con IE (IE lo encuentro inestable). MUCHISIMAS GRACIAS POR YU AYUDA

Responder
Gem@

yz Biennnn Priamo me diste la alegría del día, ya tenía yo penita de ver que te estaba costando.
Sobre navegadores hay gustos para todo, personalmente prefiero y uso Firefox eso no quiere decir que sea nejor o peor pero si puedo decir que la mayoría de problemas que me consultan son los proporcionados con Explorer :O
Gracias a ti por venir a ponerme al corriente :)

Responder
Construya Facil

Gracias por el truco al pareser me funciono perfecto...pueden ver como quedo en Zona Estrenos

Gracias...

Responder
Gem@

yz soloconstruccion me alegra que funcionara bien :D

Responder
Priamo

Gema una cuestion: si accedes a mi blog veras que las fotos en miniatura como en la ampliada la calidad es baja dado que se ve la foto como temblorosa en los contornos (blog:eltallerdepriamo.blogspot.com).
Pistas: Las url de las fotos las he subido de Sky drive con una calidad alta.El tamano de CSS son de width:100% y height:500px.
Hablas en la entrada de bajarlas fotos desde blogger pero de donde saco la url??. Ya me dirás.Gracias

Responder
Gem@

yz Hola Priamo, en realidad me refiero a subir las fotos es decir añadirlas a una entrada copiar la url y luego dejar esa entrada en borrador de esa forma las imágenes siguen en Blogger pero no las vemos en el blog porque está guardada en borrador.
Para conseguir la url de una imagen bastaría con subirla normalmente y luego en la pestaña Edición de HTML del mismo editor podemos copiar la url de la imagen.
Nos proporciona 2 la primera siempre dice s1600 y la segunda según el tamaño que escogemos puede ser 200, 320, 400
De las últimas puedes escoger la que más se acerque a tamañopero aún así puedes conseguir que la imagen se muestre en tamaño real si eliminamos las dos primeras cifras y dejamos únicamente el último 0.

Responder
Priamo

Hola gema he hecho lo que tu dices(subir imagenes a blogger...) y funciona pero sigo viendo la foto distorsionada.He hecho: Subir la foto a tamaño grande es decir 400x400 y he quitado el 40 para verla en tamaño real:OK pero sigo viendola distorsionada. El caso es que si visiono la foto en otro programa ésta se vé perfectamente lo cual me indica que el problema es al ubicarla en lytebox pero no sé arreglarlo.
Si accedes a mi al blog de pruebas (priamo24.blogspot.com) lo veras.Gracias por tu ayuda

Responder
Priamo

Gema tengo esta conclusion: Subiendo las fotos con los tamaños de blogger:Peq.medianas y Grandes las fotos se visualizan perfectamente pero claro cuando le quito el 40 para verla en el tamaño real es cuando se distorsiona. No sé si hay remedio el poder verlas a tamaño mayor que 400, supongo que sí porque en una web lo he visto.Un saludo funcionar.

Responder
Gem@

yz Priamo en problema es que la imagen se reduce y por eso no tiene la misma calidad, lo ideal y recomendable sería añadir dos imágenes una para la miniatura y otra en tamaño real para la ampliación en la ventana modal.
Es más trabajo pero es lo más acertado porque si vas a añadir muchas imágenes resulta que para una miniatura estamos añadiendo imágenes grandes.
Hay páginas online donde puedes reducir imágenes o con algún programita que tengas.
Haz la prueba con una imagen de las medidas adecuadas, de todas formas las imágenes que tratas de añadir son muy grandes 1600px × 1200px
el mayor problema es ese :O

Responder
Anónimo

Sabes? intente poner este codigo, para asi poder ver imagenes , pero no puedo lograr que las imagenes se vean asi , puedes explicarme mejor o puedes pasarme uno ya preparado para asi por lo menos saber hacerlo?
gracias

Responder
Priamo

Hola Gema: lo he hecho: miniatura en peq :OK pero tamaño real o 400x400 para la ampliacion pero se deforma. Estoy probando con el visor expando y veo que no queda mal aunque si consigues decirme algo más te lo agradeceria.Hasta entonces un saludo y gracias

Responder
Priamo

Por cierto se me olvidaba,al final del post: "Enlances a esta entrada" hay uno " Carrusel de imagenes" y veo que allí hay imagenes grandes que no estan deformadas como las mias:sabes algo mas de como estan tomadas y sus caracteristicas a fin de compararlas con las mias y ver donde puede estar el afllo?.
Gracias

Responder
Gem@

yz Alex Nagisa mira la siguiente url es una actualización de esta misma entrada:
http://gemablog-.blogspot.com/2009/05/lytebox-otra-forma.html

yz Priamo en el carrusel son miniaturas de 110px × 83px y las ampliaciones son de distintos tamaños, se muestran en sus tamaños originales.

Responder
Tinkertripper

Hola, Gema, no sé dónde hacer la pregunta, así que allá va: ¿sabes cómo poner un slideshow de photobucket en una entrada en lugar de como gadget de la sidebar? Me gustaría hacerlo para una home... gracias a tí y a Lujo llevo ya 6 blogs!!! Esto es un vicio!!! Gracias

http://adorablebones.blogspot.com/

Responder
Tinkertripper

Buenooooooo... no te lo vas a creer, lo he descubierto solita... has creado un monstruo del blog!!! Ahora sólo me falta saber cómo coloco la home como página principal, sin que se vean los otros comentarios debajo. Lo hice en tinkertrips.blogspot, pero no me acuerdo y además éste tiene un menú diferente. Help?

Responder
Gem@

:: jajajaja Tinkertripper es un vicio y que lo digas!!
Tinkertripper si lo que deseas es añadir el slideshow como una entrada pero sin título ni comentarios puedes añadirlo en un gadget de html en lugar de una entrada, Luego arrastras ese gadget y lo sitúas sobre las entradas.
No sé si es eso lo que deseas hacer :S

Responder
Tinkertripper

Sí, es eso lo que quería hacer y lo que he hecho ya. Además he descubierto que poniendo sólo 1 o 2 entradas para mostrar he conseguido hacer el inicio.
En realidad hice copiar y pegar lo que aparecía en el gadget, porque photobucket tiene una aplicación para colocar directamente el slideshow en la sidebar, y luego cogí el código del gadget y lo pegué en una entrada, y tan amigos.
Muchas gracias, eres la mejor!!!

Responder
Gem@

:: Estupendo :)

Responder
Tinkertripper

Hola, otra vez la pesada de yo; necesito quitar la zona habilitada paara poner comentarios en uno de mis blogs para que sea más parecido a una página web. Cómo puedo hacerlo? No lo encuentro por ninguna parte. Saludines!

Responder
Gem@

:: Hola Tinkertripper yo creo que esta entrada te será muy %% útil

Responder
Gem@

:: Tinkertripper ¿te refieres a ocultar el post-footer de las entradas? donde se encuentran los datos de autor, comentarios y etiquetas?

%% paginas-estaticas-sencillas

Responder
Tinkertripper

Gracias, Gema, ya he conseguido lo que quería. En realidad, si cambio la fecha de la entrada poniendo un año como el 2080, lo acepta como primera página siempre, así que me sirve de inicio y es muy sencillo. Estoy construyendo una web site para un centro que voy a abrir, pero no sé si está quedando un poco cutre... si se nota mucho que es un blog. Te importa pasarte y decirme si puedo modificar algo a tu juicio? Me harías un favorazo.
http://www.blayworks.com/

Responder
Gem@

:: Tinkertripper no me gusta opinar sobre ningún sitio porque las opiniones pueden ser distintas según la persona y lo que para unos es estupendo para otros puede resultar todo lo contrario.
Cuando se hace una página web casi siempre se hace pensando a quien va destinada, se pone especial interés en lo que trata de transmitir, informar, captar clientes, vender un producto... que la información sea clara y con cierto atractivo para captar la atención de las visitas.
Son detalles que hay que planificar y tener esas ideas claras antes de comenzar.
Cuando no se está muy seguro de obtener los resultados esperados lo mejor es ponerse en manos de profesionales, si esto no fuera posible pues nos lanzamos y hacemos mil pruebas en un blog hasta conseguir el resultado si no esperado que al menos se acerque a lo esperado.

Responder
Tinkertripper

Pues tienes razón, pero como de momento tengo que recortar gastos, voy a hacer lo que voy pudiedo y a lo mejor más adelante ya pido que me la hagan. Gracias!

Responder
Gem@

:: Tinkertripper por eso te decía que lo mejor es plantearse primero lo que deseamos hacer, porque una vez marcamos la idea ya todo es ir trabajando sobre esa idea, una buena opción es mirar páginas que nos aporten esas ideas y uego como te decía en un blog de pruebas comenzar la tarea.
Porque si trabajas sobre la misma plantilla que vas a dejar vas a tener muchos quebraderos de cabeza.

Responder
Unknown
Este comentario ha sido eliminado por el autor.
Responder
Anónimo

Justo lo que buscaba... te doy un 10!!! jajaja te dejo el link por si te animas a verlo http://adictosaltwitter.blogspot.com/ Saludos!

Responder
Gem@

:: Me alegra mucho Daniel, acepto el 10 iré sumando :D

Responder
Wachimoni

Hola Gema. Verás, tengo un problema con lytebox. He mirado en mil sitios y no encuentro la solución.
La cosa es que, instalado lytebox, funciona perfectamente cuando accedo con mi cuenta, pero cuando accedo sin cuenta no funciona; las imagenes se muestran fuera del blog.
Pregunté a gente conocida si a ellos les funcionaba bien, y me dijeron que no. U_U

No tengo ni idea de qué puede ser...

Responder
Gem@

:: -=Charley=- al principio de la entrada dice que si piensas añadir Lytebox te recomiendo leer esta entrada, y "esta" es un enlace:
http://gemablog-.blogspot.com/2009/05/lytebox-otra-forma.html
¿Has seguido los pasos que ahí se indican??

Responder
Wachimoni

Hola Gema, antes de nada, muchisimas gracias. La verdad es que probé poniendo los dos archivos en la plantilla, y no me funcionó, pero no probé con el gadget ^_^"
Ahora parece que funciona perfecto. Gracias.

Responder
Gem@

:: Estupendo, me alegra que esté resuelto -=Charley= :)

Responder
Club Aldara Sport

Buenas una pregunta sobre el tema, tengo un problema una vez que carga la imagen no puedo cerrarla desde el icono Close, es decir que no me funciona el icono close para cerrar, tampoco el play y el pause solo me funcionan el next y prev, sabes de que puede ser.

Un saludo

Responder
Gem@

:: Saludos Club Aldara Sport, tendría que ver un ejemplo para saber qué ocurre, pero siguiendo los pasos funciona sin problemas :)

Responder
4EverMadonna

Hola gema!! a lo largo de mi paso por blogger has sido mi compañera en lo que la edicion y manejo de las plantillas, y el blog en gral... sin saberlo tu me has ayudado ;).

ahora me surgio un problemita, ayer retome mi trabajo en mi blog, y cambie mi plantilla en motivo de renovacion... todo lo pude modificar bien... despues de dolores de cabeza obvio...

pero me encontre con que al momento de ver las imagenes de los post veo que las imagenes se salen de los bordes, y no es posible acceder al boton close... es decir no funciona el link pero si se ve la imagen de "close" medio tapada por la imagen que contiene...


SI PODES POR FAVOR, CHEQUEA ESTE LINK: http://4evermadonna.blogspot.com/2010_06_01_archive.html

Si podes decirme a que se debe o como puedo arreglarlo te agradeceria!

INFO: la plantilla que utilize es NICE-STARS lo descargue en blogger templates!

Responder
4EverMadonna

te di el link equivocado perdon!!

este es: http://4evermadonna.blogspot.com/2010/09/mas-de-la-fiesta-de-macys.html

Responder
Fantasma Velez

Buenas. Mi nombre es Fantasma Velez, y les comento, que a veces por ser prolijos, colocamos el .JS y el .CSS dentro de una carpeta de nombre (JS) y en otra llamada (CSS). A mi no me funcionaba el ICONO de CLOSE (cerrar) y lo solucione, quitandolos de las carpetas (JS) y (CSS) donde los había puesto, y los puse directamente en la carpeta raíz donde están todos los archivos. Espero les sirva. Saludos

Responder
Fantasma Velez

Quisiera saber, como puedo quitar el BORDER, el borde de todas las ventanas que abre el efecto? Por que me aparece el contenido con un borde sobre la ventana y otro borde en el interior. Me gustaría poder dejar toda la ventana sin bordes. Muchas gracias

Responder
Gem@

:: Fantasma Velez en realidad no hace falta colocar nada en ninguna carpeta porque se puede añadir todo en la misma plantilla sin necesidad de alojamientos externos.
Al principio de la entrada dejo información y enlace indicando la forma de hacerlo, lamento si no la ha visto.

Los bordes pueden eliminarse en los estilos css, de ahí lo anteriormente de añadir los estilos a la plantilla directamente porque su personalización es mucho más cómoda.
Tendría que ver un ejemplo online funcionando para indicar donde están esos bordes a eliminar pero lamentablemente su perfil no está activado.

Shadowbox es muy elegante y añade menos bordes:
http://gemablog-.blogspot.com/2010/10/shadowbox-elegante-y-completa-ventana.html

Responder
Fantasma Velez

Muchisimas gracias Gem@ conocer un sitio excelente como este y que aparte respondan a las dudas enseguida, da gusto seguir entrando. Vi lo que me comentabas, pero mejor te lo respondo donde corresponde. Saludos atentamente

Responder
Gem@

:: Saludos Fantasma Velez, lo de responder enseguida es producto de la casualidad, veré ese otro comentario.

Responder
F!X

HOla Gema, antes que nada, muchas gracias, hace un año que uso lytebox en mi portfolio y en mis blogs, todo gracias a ti.
Lo que quisiera saber es si se puede usar una imagen abierta con litebox como presentacion de blog.
Me explico: que el navegante al entrar a http://miblog.com/ vea una imagen de bienvenida en litebox y la pueda cerrar.
Un beso desde Argentina y muchas gracias nuevamente :)

Responder
Gem@

:: Hola F!X nunca probé lo que mencionas pero si recuerdo que leí un hilo de comentarios en Vagabudnia que trataba sobre el tema igual allí pueden ayudarte :)
http://vagabundia.blogspot.com/2008/04/lytebox-una-alternativa-ms-liviana.html

Responder
Construya Facil

No pude descargar los archivos...:$

Responder
Gem@

:: Admin no es necesario que descargues nada si te das cuenta hay una frase al principio d ela entrada que dice "Si piensas añadir Lytebox te recomiendo leer antes esta entrada" sigue e4se enlace y de proporciona lo necesario para añadir los scripts a la plantilla.

Responder
Construya Facil

Ok, Gema muchas gracias por tu ayuda...creo que me quedo perfecto, para el que quera mirar aquí les dejo http://mundo-construccion.blogspot.com/2001/08/httpsmail.html :D

Responder
César Delgado Pérez

Hola Gema, no sabía donde ponerte mi consulta.
¿Hay alguna manera de arreglar la cabecera de mi blog, para que se vea con i.explorer igual que con el resto de navegadores?.
Solo tengo problemas con explorer, "veo demasiado espacio entre los gadget de la cabecera".
Un saludo y muchas gracias.

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top